/*
 * @Description: 
 * @Version: 2.0
 * @Author: cxc
 * @Date: 2022-03-30 10:35:28
 * @LastEditors: cxc
 * @LastEditTime: 2022-04-01 09:23:47
 */
import React, { useEffect, useState } from 'react'
import { useLocation } from 'react-router-dom'
import { Input, Row, Button } from 'antd';
import {
  DownOutlined,
  UpOutlined
} from '@ant-design/icons';
import ComButton from './ComButton';

export default function Search(props) {
  const location = useLocation()
  const { handleShow } = props
  const [isShow, setIsShow] = useState(true)
  // 高级搜索
  async function handleSeniorSearch() {
    if (location.pathname !== '/employee/employeesList') return
    setIsShow(!isShow)
  }
  useEffect(() => {
    if (typeof handleShow === 'function') {
      handleShow(isShow)

    }
  }, [isShow])
  return (
    <>
      <Row style={{ display: 'flex', justifyContent: 'flex-end' }}>
        <Input placeholder="员工账号、姓名、手机号" style={{ display: 'inline-block', width: '200px' }} />
        <ComButton type='primary' btnName='搜索' size='middle' BCcolor='#2396b2' />
        <div style={{ marginLeft: '16px', }}>
          <Button onClick={handleSeniorSearch} type='primary' size='middle' style={{ backgroundColor: '#cc2626 ' }}>高级搜索 {isShow === false ? <DownOutlined /> : <UpOutlined />}</Button>
        </div>
      </Row>
    </>
  )
}
